<template>
  <div class="more-match">
    <div class="opendetail" @click="openmatchdetail(match)">
      <div>全部</div>
      <div style="display: flex;align-items: center;">
        <el-icon>
          <CaretRight />
        </el-icon>
      </div>
    </div>
    <!-- <OtherType :match="match" @change="request" />

    <div v-if="match.match_id == state.other.match?.match_id" v-loading="state.other.loading">
      <el-empty description="暂无数据" v-if="!data || data.length == 0" />
      <template v-else>
        <Rq :match="match" :odds="data" v-if="state.other.otherType == 'RQ'" />
        <Jq :match="match" :odds="data" v-else-if="state.other.otherType == 'JQ'" />
        <Jq :match="match" :odds="data" v-else-if="state.other.otherType == 'FP'" />
      </template>
</div> -->
  </div>
</template>
<script setup>
import OtherType from './OtherType.vue'
import Rq from './Rq.vue'
import Jq from './Jq.vue'

const props = defineProps({
  match: Object,
})

const { store, state } = inject('Sell')
const { detailstore, detailstate } = inject('detailSell')

const data = computed(() => {
  return {
    RQ: state.other.data?._rqData,
    JQ: state.other.data?.ce_odds_data,
  }[state.other.otherType]
})

const openmatchdetail = (match) => {
  state.matchdetail.show = true
  detailstore.openmatchdetail(match)
}
</script>
<style lang="scss" scoped>
.more-match {
  margin-top: 4px;
}

.opendetail {
  width: 60px;
  height: 24px;
  border-radius: 14px;
  background-color: #f5f5f5;
  margin-right: 8px;
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>
